import React, { useEffect, useRef, useState } from "react";

// 这个组件可能被当做函数调用，不能在里面写生命周期
export default function Iframe({ src }: { src: string }){

  const iframeRef = useRef<HTMLIFrameElement>(null);

  const [height, setHeight] = useState<number>();

  useEffect(() => {
    window.addEventListener('message',(e)=>{
      if(e.data.type === 'windowHeightOnChange'){
        setHeight(e.data.data.height);
      }
    })
  }, []);

  return <iframe
    ref={iframeRef}
    src={src}
    frameBorder={0}
    scrolling="no"
    width="100%"
    height={height ?? 600}
    marginHeight={0}
    marginWidth={0}
  />
}
